<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>添加银行卡 - 帐号设置 - 用户中心</title>
  {include file="public/css"}
</head>
<body>
<div class="layui-row" style="padding-top:30px;">
<div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
  <ul class="layui-tab-title" style="width:160px;margin:0 auto">
    <li class="layui-this">添加银行卡</li>
  </ul>
</div> 
   
   <form class="layui-form" action="">

                              <div class="layui-form-item">
                                <label class="layui-form-label"  style="width:80px;">银行卡</label>
                                <div class="layui-input-inline" style="width:300px;">
                                    <select name="bank_type"  lay-filter="bank_type">
                                    <option></option> 
                                     {foreach $banklist  as $key=>$vo}
                                      <option value="{$key}">{$vo['name']}</option>
                                      {/foreach}
                                    </select>
                                </div>
                              </div>

                              <div class="layui-form-item">
                                <label class="layui-form-label branch-title"  style="width:80px;">开户网点</label>
                                <div class="layui-input-inline" style="width:300px;">
                                  <input type="text" name="branch"  placeholder="请输入开户网点" autocomplete="off" class="layui-input branch">
                                </div>
                              </div>
                               <div class="layui-form-item">
                             <label class="layui-form-label card-number-title"  style="width:80px;">银行卡号</label>
                                <div class="layui-input-inline" style="width:300px;">
                                  <input type="text" name="card_number"  placeholder="请输入支付机构的卡号/账号" autocomplete="off" class="layui-input card-number">
                                </div>
                              </div>                    
                              <div class="layui-form-item">
                                <label class="layui-form-label"  style="width:80px;">账户姓名</label>
                                <div class="layui-input-inline" style="width:300px;">
                                  <input type="text" name="realname"  placeholder="请输入绑定的真实姓名" autocomplete="off" class="layui-input">
                                </div>
                              </div>  

                              <div class="layui-form-item">
                                <label class="layui-form-label"  style="width:80px;">开户手机号</label>
                                <div class="layui-input-inline" style="width:300px;">
                                  <input type="text" name="mobile"  placeholder="请输入绑定的手机号" autocomplete="off" class="layui-input">
                                </div>
                              </div> 
                               <div class="layui-form-item"  >
                                 <label class="layui-form-label"  style="width:80px;"></label>
                                <div class="layui-input-inline" style="width:300px;">
                                  <button class="layui-btn layui-btn-fluid layui-btn-normal" lay-submit lay-filter="form">确定</button>
                                </div>
                              </div>  
                            </form>

</div>

{include file="public/js"}

<script>
layui.use(['element', 'layer','form'], function(){
   var  element = layui.element, layer = layui.layer,form = layui.form;
 //监听提交
  form.on('submit(form)', function(data){
    $.post("{:url('bank/addbank')}",$("form").serialize(),function(json){
          if(json.code == 0){
            layer.msg(json.msg);
            parent.location.reload();
          }else{
            layer.msg(json.msg);
          }
    });
    return false; //阻止表单跳转
  });
 


  form.on('select(bank_type)', function(data){
    bank(data.value);
  });
  function bank(value){
     if( value =='alipay'){
       $(".branch-title").html('支付公司');
       $(".branch").val('支付宝网络技术有限公司');
       $(".branch").attr('readonly','readonly');
       
       $(".card-number-title").html('支付账号');
      
    }else if(value =='weixin'){
       $(".branch-title").html('支付公司');
       $(".branch").val('深圳市腾讯计算机系统有限公司');
       $(".branch").attr('readonly','readonly');      
       $(".card-number-title").html('支付账号');
    }else{
      $(".branch-title").html('开户网点');
     
      $(".branch").removeAttr('readonly');
      $(".branch").val('');

      $(".card-number-title").html('银行卡号');
    }
  } 
});
</script>
</body>
</html>